<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache" content="no-cache">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <link rel="stylesheet" href="../../css/style.css" />
    <link rel="stylesheet" href="../../css/element.css?v=1">
    <script src="../../js/zyrpublic.js?v=1.0"></script>
    <script src="../../js/zyrfunction.js?v=1.0"></script>

    <script src="../../javascript/vue.js"></script>
    <script src="../../javascript/elementui.js"></script>
    <script src="../../javascript/axios.min.js"></script>
    <script src="../../js/qs.js"></script>
</head>

<body>
    <div class="page-wrap" id="app">
        <section class="page-hd t">
            <header>
                <h5 class="title">
                    <a href="#" class="red">积分商品</a>
                </h5>
            </header>
            <hr />
        </section>
        <el-tabs type="border-card" @tab-click="handleClickTab">
            <el-tab-pane label="积分换好物"></el-tab-pane>
            <el-tab-pane label="推荐好物"> </el-tab-pane>
            <el-tab-pane label="精选好茶"> </el-tab-pane>
            <el-tab-pane label="平台特色"> </el-tab-pane>
            <el-tab-pane label="高级兑换区"> </el-tab-pane>
            <div style="margin-bottom: 20px">
                <el-button type="primary" @click="addGoods">新增</el-button>
                <el-button plain @click="delGoods">删除</el-button>
            </div>
            <el-table @selection-change="handleSelectionChange"
                :header-cell-style="{background:'#f7f4f8', color:'#000'}" :data="tableintegralList"
                tooltip-effect="dark" style="width: 100%">
                <el-table-column type="selection" width="55"> </el-table-column>
                <el-table-column prop="id" label="商品ID"> </el-table-column>
                <el-table-column prop="prodNo" label="商品编号" prop="name">
                </el-table-column>
                <el-table-column prop="prodName" label="商品名称">
                </el-table-column>
                <el-table-column label="兑换积分" width="385">
                    <template slot-scope="scope">
                        <div>
                            <div v-for="(e,i) in scope.row.memberIntegralSetmealList" :key="i">
                                {{e.setmealName}} {{e.sectionIntegralPrice}}积分 +
                                {{e.sectionMoneyPrice}}价格
                            </div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="库存">
                    <template slot-scope="scope">
                        <div>
                            <div v-for="(e,i) in scope.row.memberIntegralSetmealList" :key="i">
                                {{e.stockNum}}
                            </div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="是否上架">
                    <template slot-scope="scope">
                        <div>
                            <el-switch active-color="#13ce66" inactive-color="#000"
                                @change="handleChangeSwitch(scope.row)" v-model="scope.row.upShelf">
                            </el-switch>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <span @click="fnedit(scope.row)" style="color: #11947f; display: inline-block">
                            <i class="el-icon-edit"></i>编辑</span>
                        <span @click="fndel(scope.row)" style="color: #11947f; display: inline-block">
                            <i class="el-icon-delete"></i>删除</span>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum"
                :page-size="pageSize" layout="total, sizes, prev, pager, next" :total="talLength">
            </el-pagination>
        </el-tabs>
    </div>
    <!---page-wrap------>
</body>

<script>
    var instance = axios.create({
        baseURL: httpurl,
        timeout: 3000,
        headers: {
            "Content-Type": "application/json",
            Authorization: GetTokenInfo(),
        },
    });
</script>

<script>
    var app = new Vue({
        el: "#app",
        data() {
            return {
                val1: true,
                pageNum: 1,
                pageSize: 10,
                talLength: 10,
                tabIndex: 1,
                type: 1,// 1 积分换好物 2 推荐好物 3 精选好茶 4 平台特色 5 高级兑换区
                tableintegralList: [],
                idList: [],
            };
        },

        mounted() {
            this.getqueryMemberIntegralProductList();
        },

        methods: {
            //
            handleClickTab(e) {
                let index = +e.index + 1;
                this.tabIndex = index;
                this.type = index
                this.pageNum = 1
                this.getqueryMemberIntegralProductList();
                console.log(index);
            },
            //
            addGoods() {
                window.location.href = `./addIntegralGoods.html?integralId=${this.tabIndex}`;
            },
            //
            handleChangeSwitch(e) {
                let tempObj = {
                    id: e.id,
                    prodName: e.prodName,
                    prodNo: e.prodNo,
                    mainImage: e.mainImage,
                    carouselImage: e.carouselImage,
                    prodDesc: e.prodDesc,
                    type: e.type,
                    // startTime: e.startTime,
                    // endTime: e.endTime,
                    upShelf: e.upShelf == true ? 1 : 2,
                    // deleted: e.deleted,
                    setmealGroup: e.setmealGroup,
                    integralSetmealList: e.memberIntegralSetmealList,
                };

                instance.post("updateMemberIntegralProduct", tempObj).then((res) => {
                    console.log(res);
                    if (res.data.rtnCode == 200) {
                        this.getqueryMemberIntegralProductList();
                        this.$message.success("修改商品成功");
                    } else {
                        this.$message.error("修改商品失败");
                    }
                });
            },
            //积分商品列表查询
            getqueryMemberIntegralProductList() {
                instance
                    .get("queryMemberIntegralProductList", {
                        params: {
                            pageNo: this.pageNum,
                            pageSize: this.pageSize,
                            type: this.type,
                        },
                    })
                    .then((res) => {
                        console.log(res);
                        if (res.data.rtnCode == 200) {
                            list = res.data.data.list;
                            list = list.map((e) => {
                                return {
                                    id: e.id,
                                    prodName: e.prodName,
                                    prodNo: e.prodNo,
                                    mainImage: e.mainImage,
                                    carouselImage: e.carouselImage,
                                    prodDesc: e.prodDesc,
                                    type: e.type,
                                    startTime: e.startTime,
                                    endTime: e.endTime,
                                    createTime: e.createTime,
                                    upShelf: e.upShelf == 1 ? true : false,
                                    deleted: e.deleted,
                                    updateTime: e.updateTime,
                                    setmealGroup: e.setmealGroup,
                                    memberIntegralSetmealList: e.memberIntegralSetmealList,
                                };
                            });
                            this.tableintegralList = list;
                            this.talLength = res.data.data.total;
                        }else{
                            this.tableintegralList = []
                        }
                    });
            },
            //
            fnedit(val) {
                console.log(val);
                window.location.href = `./addIntegralGoods.html?goodId=${val.id}`;
            },
            // 批量删除
            async delGoods() {
                let confirmResult = await this.$confirm(
                    "此操作将永久删除该数据, 是否继续?",
                    "提示",
                    {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    }
                ).catch((err) => err);
                if (confirmResult !== "confirm") {
                    return this.$message.info("已取消删除！");
                }

                let res = await instance.post("updateMemberIntegralProductByIdList ", {
                    idList: this.idList,
                    deleted: 1,
                    type: this.tabIndex,
                });
                if (res.data.rtnCode == 200) {
                    this.getqueryMemberIntegralProductList()
                    this.$message.success('删除商品成功')

                } else {
                    this.$message.error('删除商品失败')
                }
            },
            // 单个删除
            async fndel(val) {
                let confirmResult = await this.$confirm(
                    "此操作将永久删除该数据, 是否继续?",
                    "提示",
                    {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    }
                ).catch((err) => err);
                if (confirmResult !== "confirm") {
                    return this.$message.info("已取消删除！");
                }
                let res = await instance.post("updateMemberIntegralProduct", {
                    id: val.id,
                    deleted: 1,
                    type: this.tabIndex,
                })
                console.log(res);
                if (res.data.rtnCode == 200) {
                    this.getqueryMemberIntegralProductList()
                    this.$message.success('删除商品成功')

                } else {
                    this.$message.error('删除商品失败')
                }
            },
            // 选中列表项
            handleSelectionChange(val) {

                let idList = [];
                val.forEach((v) => {
                    idList.push(v.id);
                });
                this.idList = idList;
            },
            handleSizeChange(val) {
                this.pageSize = val;
                this.getqueryMemberIntegralProductList();
            },
            handleCurrentChange(val) {
                this.pageNum = val;
                this.getqueryMemberIntegralProductList();
            },
        },
    });
</script>

</html>